import React from 'react';

import '@/assets/css/login.css'

const Register = () =>
{
    // 实例化钩子
    const navigate = React.Router.useNavigate()

    const register = async (values:any) => {
        // console.log(values)
        var result:any = await React.HTTP.post('/business/register',values)

        if(result.code){
            React.UI.Toast.show({
                icon: 'success',
                content: result.msg,
                afterClose: () => {
                    navigate('/business/login')
                    return false
                }
            })
        }else{
            React.UI.Toast.show({
                icon: 'fail',
                content: result.msg
            })
            return false
        }
    }

    return (
        <>
            
            <div className="login">
            <div className='title'><h1>注册</h1></div>
                <React.UI.Form
                    name='form'
                    onFinish={register}
                    footer={
                    <React.UI.Button block shape='rounded' type='submit' color='primary' size='large'>
                        注册
                    </React.UI.Button>
                    }
                >
                    <React.UI.Form.Item name='mobile' label='手机号' rules={[{ required: true },{pattern:/^1[3456789]\d{9}$/, message: '手机号格式不对'}]}>
                        <React.UI.Input placeholder='请输入手机号' />
                    </React.UI.Form.Item>

                    <React.UI.Form.Item name='password' label='密码' rules={[{ required: true }]}>
                        <React.UI.Input type='password' placeholder='请输入密码' />
                    </React.UI.Form.Item>

                </React.UI.Form>

                <React.Router.Link to={'/business/login'}>
                    已有账号，前去登录
                </React.Router.Link>
            </div>
        </>
    )
}

export default Register;